<template>
  <div>
    <van-row>
      <van-col span=6> <van-button round
                    type="primary"
                    @click="goBack">
          返回
        </van-button></van-col>
      <van-col span=13>
        <van-field name="盘点单号"
                   label="盘点单号："
                   v-model="addForm.pdHId"
                   readonly />

      </van-col>
    </van-row>
    <van-row>
      <van-field name="门店名称"
                 label="门店名称："
                 v-model="this.$store.getters.getGlobalOrgname"
                 readonly />
    </van-row>
    <van-row>
      <van-col span=14><van-field name="商品编码"
                   label="商品编码："
                   type="number"
                   placeholder="请输入"
                   v-model="addForm.warecode"
                   :rules="[{ required: true, message: '请填写门店号' }]" /></van-col>
      <van-col span=8> <van-button round
                    block
                    type="primary"
                    @click="qureyByWarecode">
          查询
        </van-button></van-col>
    </van-row>
    <van-row>
      <!-- 扫码：<input type="file"
               accept="image/*"
               @change="handleFileChange"> -->
      <button @click="scanQRCode">扫码</button>

    </van-row>

    <van-row>
      <van-col><van-field name="商品名称"
                   label="商品名称："
                   v-model="addForm.warename"
                   disabled /></van-col>
    </van-row>

    <van-row>
      <van-field name="商品规格"
                 label="商品规格："
                 v-model="addForm.warespec"
                 disabled />

    </van-row>
    <van-row>
      <van-col span=10>
        <van-field name="商品单位"
                   label="商品单位："
                   v-model="addForm.wareunit"
                   disabled /></van-col>
      <van-col span=14>
        <van-field name="最新售价"
                   label="最新售价："
                   v-model="addForm.lastsaleprice"
                   disabled /></van-col>
    </van-row>

    <van-row>
      <van-field name="商品厂家"
                 label="商品厂家："
                 v-model="addForm.factoryname"
                 disabled />
    </van-row>
    <van-row>
      <van-field name="商品产地"
                 label="商品产地："
                 v-model="addForm.areaname"
                 disabled />
    </van-row>

    <van-row>
      <van-col span=14><van-field name="商品数量"
                   label="商品数量："
                   placeholder="请输入"
                   v-model="addForm.qty"
                   type="number"
                   :rules="[{ required: true, message: '请填写商品数量' }]" /></van-col>
      <van-col span=8> <van-button round
                    block
                    type="primary"
                    @click="submit">
          保存
        </van-button></van-col>
    </van-row>

    <br /> <br />
    <vue-good-table :columns="columns"
                    :rows="rows"
                    @on-row-click="onRowClick">
      <!-- 自定义按钮列 -->
      <!-- <template slot="table-row"
                slot-scope="props">
        <td>
          <button @click="handleButtonClick(props.row)">删除</button>
        </td>
      </template> -->
    </vue-good-table>
  </div>
</template>
    
    <script>
import 'vue-good-table/dist/vue-good-table.css'
import { VueGoodTable } from 'vue-good-table';
import http from '../../api/http.js'
import Quagga from 'quagga'; // 或者其他扫码库
import WechatService from '../../service/WechatService';



// add to component


export default {
  components: {
    VueGoodTable,
  },

  name: 'my-component',
  data () {
    return {
      addForm: {
        warecode: "",
        warename: "",
        wareunit: "",
        warespec: "",
        factoryname: "",
        areaname: "",
        barcode: "",
        busno: "",
        orgname: "",
        pdHId: "",
        qty: "",
        createEmpname: "",
        lastsaleprice: ""
      },
      columns: [
        {
          label: '明细Id',
          field: 'pdDId',
        }
        ,
        {
          label: '商品编码',
          field: 'warecode',
        },
        {
          label: '数量',
          field: 'qty',
        },
        {
          label: '盘点人员',
          field: 'createEmpname',
        },
        {
          label: '盘点时间',
          field: 'createDatetime',
        },
        // {
        //   label: '盘点时间',
        //   field: 'action',
        // }
      ],
      rows: [
        // { warecode: '111', qty: '111', createDatetime: '1', createDatetime: '3' }
      ],
    };
  },
  mounted () {
    WechatService.init();
    this.addForm.pdHId = this.$route.params.id
    Quagga.init({
      inputStream: {
        name: "Live",
        type: "LiveStream"
      },
      decoder: {
        readers: ['code_128_reader', 'ean_reader', 'ean_8_reader', 'code_39_reader', 'code_39_vin_reader', 'upc_reader', 'upc_e_reader', 'i2of5_reader']
      }
    }, function (err) {
      if (err) {
        console.log(err);
        return;
      }
      Quagga.start();
    });
    Quagga.onDetected((result) => {
      this.code = result.codeResult.code;
      Quagga.stop();
    });
  },
  methods: {
    scanQRCode () {
      this.scanResult = '2222';
      WechatService.scanQRCode(
        result => {
          // 扫码成功的处理逻辑
          console.info(result)
          let result2 = result.split(",");
          //this.scanResult = result2[1];
          http.fetchGet('/pd/qureyWareFromHdByBarcode?barcode=' + result2[1]).then((data) => {
            if (data.data.msg != 'success') {
              this.$toast(data.data.msg)
            } else {
              //console.info(data.data.data.orgname)
              if (data.data.data === null || data.data.data === undefined || data.data.data === '') {
                this.$toast('找不到商品')
                this.addForm.warename = ""
                this.addForm.wareunit = ""
                this.addForm.warespec = ""
                this.addForm.factoryname = ""
                this.addForm.areaname = ""
                this.addForm.barcode = ""
                this.addForm.warecode = ""
                this.addForm.qty = ""
                this.addForm.lastsaleprice = ""
              } else {
                this.addForm.warecode = data.data.data.warecode
                this.addForm.warename = data.data.data.warename
                this.addForm.wareunit = data.data.data.wareunit
                this.addForm.warespec = data.data.data.warespec
                this.addForm.factoryname = data.data.data.factoryname
                this.addForm.areaname = data.data.data.areaname
                this.addForm.barcode = data.data.data.barcode
                this.addForm.lastsaleprice = data.data.data.lastsaleprice

                http.fetchGet('/pd/qureyPddByWarecode?warecode=' + this.addForm.warecode + '&pdHid=' + this.addForm.pdHId).then((data) => {
                  if (data.data.msg != 'success') {
                    this.$toast(data.data.msg)
                  } else {
                    console.info(data.data.data)
                    this.rows = data.data.data;
                  }
                }).catch(err => {
                  console.log(err)
                }
                )
              }
            }
          }).catch(err => {
            console.log(err)
          }
          )
        },
        error => {
          // 扫码失败的处理逻辑
          console.error('Scan QR code failed:', error);
          this.addForm.warename = ""
          this.addForm.wareunit = ""
          this.addForm.warespec = ""
          this.addForm.factoryname = ""
          this.addForm.areaname = ""
          this.addForm.barcode = ""
          this.addForm.warecode = ""
          this.addForm.qty = ""
          this.addForm.lastsaleprice = ""
        }
      );
    }
    ,
    handleFileChange (event) {
      const file = event.target.files[0];
      if (!file) return;
      const reader = new FileReader();
      reader.onload = (e) => {
        this.decodeBarcode(e.target.result);
      };
      reader.readAsDataURL(file);
    },
    decodeBarcode (imageData) {
      Quagga.decodeSingle({
        src: imageData,
        decoder: {
          readers: ['code_128_reader', 'ean_reader', 'ean_8_reader', 'code_39_reader', 'code_39_vin_reader', 'upc_reader', 'upc_e_reader', 'i2of5_reader']
        },
        debug: true,
        locate: true
      },
        (result) => {
          if (result && result.codeResult) {
            console.info(result.codeResult.code);
            http.fetchGet('/pd/qureyWareFromHdByBarcode?barcode=' + result.codeResult.code).then((data) => {
              if (data.data.msg != 'success') {
                this.$toast(data.data.msg)
              } else {
                //console.info(data.data.data.orgname)
                if (data.data.data === null || data.data.data === undefined || data.data.data === '') {
                  this.addForm.warename = ""
                  this.addForm.wareunit = ""
                  this.addForm.warespec = ""
                  this.addForm.factoryname = ""
                  this.addForm.areaname = ""
                  this.addForm.barcode = ""
                  this.addForm.warecode = ""
                  this.addForm.qty = ""
                  this.addForm.lastsaleprice = ""
                } else {
                  this.addForm.warename = data.data.data.warename
                  this.addForm.wareunit = data.data.data.wareunit
                  this.addForm.warespec = data.data.data.warespec
                  this.addForm.factoryname = data.data.data.factoryname
                  this.addForm.areaname = data.data.data.areaname
                  this.addForm.barcode = data.data.data.barcode
                  this.addForm.lastsaleprice = data.data.data.lastsaleprice

                }
              }
            }).catch(err => {
              console.log(err)
            }
            )
          } else {
            this.addForm.warename = ""
            this.addForm.wareunit = ""
            this.addForm.warespec = ""
            this.addForm.factoryname = ""
            this.addForm.areaname = ""
            this.addForm.barcode = ""
            this.addForm.warecode = ""
            this.addForm.qty = ""
            this.addForm.lastsaleprice = ""
            this.$toast('未能识别');
          }
        }


        // function (result) {
        //   this.addForm.warename = '222'
        //   console.info(result.codeResult);
        //   if (result.codeResult) {
        //     //this.code = result.codeResult.code;
        //     console.log(result.codeResult.code);
        //     http.fetchGet('/pd/qureyWareFromHdByBarcode?barcode=' + result.codeResult.code).then((data) => {
        //       if (data.data.msg != 'success') {
        //         this.$toast(data.data.msg)
        //       } else {
        //         //console.info(data.data.data.orgname)
        //         if (data.data.data === null || data.data.data === undefined || data.data.data === '') {
        //           // this.addForm.warename = ""
        //           // this.addForm.wareunit = ""
        //           // this.addForm.warespec = ""
        //           // this.addForm.factoryname = ""
        //           // this.addForm.areaname = ""
        //           // this.addForm.barcode = ""
        //           // this.addForm.warecode = ""
        //           // this.addForm.qty = ""
        //           // this.addForm.lastsaleprice = ""
        //         } else {
        //           // this.addForm.warename = data.data.data.warename
        //           // this.addForm.wareunit = data.data.data.wareunit
        //           // this.addForm.warespec = data.data.data.warespec
        //           // this.addForm.factoryname = data.data.data.factoryname
        //           // this.addForm.areaname = data.data.data.areaname
        //           // this.addForm.barcode = data.data.data.barcode
        //           // this.addForm.lastsaleprice = data.data.data.lastsaleprice
        //         }
        //       }
        //     }).catch(err => {
        //       console.log(err)
        //     }
        //     )
        //   } else {
        //     this.$toast("未能识别出任何编码");
        //   }
        // }


      );
    },
    onRowClick (rows) {
      // console.info(rows.row.age);


      this.$dialog.confirm({
        title: '标题',
        message:
          '是否确定删除？',
      })
        .then(() => {
          http.fetchPost('/pd/updatePdd?pdDId=' + rows.row.pdDId).then((data) => {
            console.info(data.data.data)
            if (data.data.msg != 'success') {
              this.$toast(data.data.msg)
            } else {
              this.$toast('删除成功！')
              http.fetchGet('/pd/qureyPddByWarecode?warecode=' + rows.row.warecode + '&pdHid=' + this.addForm.pdHId).then((data) => {
                if (data.data.msg != 'success') {
                  this.$toast(data.data.msg)
                } else {
                  this.rows = data.data.data;
                }
              }).catch(err => {
                console.log(err)
              }
              )
            }
          })
            .catch(() => {

            })

        }).catch(err => {
          console.log(err)
        }
        )


    },
    handleButtonClick (row) {
      console.log('Row data:', row);
      // 在这里你可以对 row 数据进行任何你想要的处理
    },
    onCellClick (params) {
      // params.row - row object 
      console.info(params.row)
      if (params.row.action == '删除') {
        alert(params.row)
      }

      // params.rowIndex - index of this row on the current page.
      // params.event - click event
    },
    handleClick (row) {
      console.log('Clicked row data:', row);
      // 在这里你可以对 row 数据进行任何你想要的处理
    },
    qureyByWarecode () {
      http.fetchGet('/pd/qureyWareFromHdByWarecode?warecode=' + this.addForm.warecode).then((data) => {
        if (data.data.msg != 'success') {
          this.$toast(data.data.msg)
        } else {
          //console.info(data.data.data.orgname)
          if (data.data.data === null || data.data.data === undefined || data.data.data === '') {
            this.addForm.warename = ""
            this.addForm.wareunit = ""
            this.addForm.warespec = ""
            this.addForm.factoryname = ""
            this.addForm.areaname = ""
            this.addForm.barcode = ""
            this.addForm.warecode = ""
            this.addForm.qty = ""
            this.addForm.lastsaleprice = ""
          } else {
            this.addForm.warename = data.data.data.warename
            this.addForm.wareunit = data.data.data.wareunit
            this.addForm.warespec = data.data.data.warespec
            this.addForm.factoryname = data.data.data.factoryname
            this.addForm.areaname = data.data.data.areaname
            this.addForm.barcode = data.data.data.barcode
            this.addForm.lastsaleprice = data.data.data.lastsaleprice
          }
        }
      }).catch(err => {
        console.log(err)
      }
      ),
        http.fetchGet('/pd/qureyPddByWarecode?warecode=' + this.addForm.warecode + '&pdHid=' + this.addForm.pdHId).then((data) => {
          if (data.data.msg != 'success') {
            this.$toast(data.data.msg)
          } else {
            console.info(data.data.data)
            this.rows = data.data.data;
          }
        }).catch(err => {
          console.log(err)
        }
        )

    },
    submit () {
      if (!this.$store.getters.getGlobalBusno) {
        this.$toast("海典门店编号缺失！请重新登录网址");
        return false
      }

      if (!this.addForm.pdHId) {
        this.$toast("盘点单号缺失！请重新登录网址");
        return false
      }

      if (!this.addForm.qty) {
        this.$toast("请输入盘点数量!");
        return false
      }


      this.addForm.orgname = this.$store.getters.getGlobalOrgname
      this.addForm.busno = this.$store.getters.getGlobalBusno
      this.addForm.createEmpname = this.$store.getters.getGlobalEmpname
      console.info(this.addForm.pdHId)
      console.info(this.addForm.createEmpname)
      http.fetchPost('/pd/pddCreate', this.addForm).then((data) => {

        if (data.data.msg != 'success') {
          this.$toast(data.data.msg)
        } else {
          this.$toast('保存成功！')

          http.fetchGet('/pd/qureyPddByWarecode?warecode=' + this.addForm.warecode + '&pdHid=' + this.addForm.pdHId).then((data) => {
            if (data.data.msg != 'success') {
              this.$toast(data.data.msg)
            } else {
              console.info(data.data.data)
              this.rows = data.data.data;
            }
          }).catch(err => {
            console.log(err)
          }
          )

          this.addForm.warename = ""
          this.addForm.wareunit = ""
          this.addForm.warespec = ""
          this.addForm.factoryname = ""
          this.addForm.areaname = ""
          this.addForm.barcode = ""
          this.addForm.warecode = ""
          this.addForm.qty = ""
          this.addForm.lastsaleprice = ""
        }


      }).catch(err => {
        console.log(err)
      }
      )
    },
    goBack () {
      this.$router.push({ name: 'interviewCreated', params: { busno: this.$store.getters.getGlobalBusno, empname: this.$store.getters.getGlobalEmpname } });
    }

  }
};

    </script>


    <style>
</style>